<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse"
          data-target=".navbar-collapse">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">SCAPES</a>
    </div>
    <div class="collapse navbar-collapse">
      <ul class="nav navbar-nav">
        <li class="active"><a href="#">Home</a></li>
        <li><a href="#about">About</a></li>
        <li><a href="#contact">Contact</a></li>
      </ul>
    </div><!--/.nav-collapse -->
  </div>
</div>

<div class="container">

  <div class="starter-template">
    <div ng-show="ctrl.isUserLoggedIn">
      <h1>SCAPES</h1>
      <p class="lead">
        Input in the folder id and click the analyze button.
      </p>
      <!-- TODO(michaelcupino): Rename docId to just inputId or something. -->
      <input type="text" ng-model="ctrl.docId"
          placeholder="Enter the folder id"
          class="form-control input-lg analyze-input" id="doc-id-input">
      <button type="button" class="btn btn-primary btn-lg btn-block
          analyze-input" ng-disabled="!ctrl.docId" id="doc-analyze-folder"
          ng-click="ctrl.analyzeFolder(ctrl.docId)">
        Analyze folder
      </button>
      <a ng-href="{{ctrl.authUrl}}" class="btn btn-default btn-lg btn-block
          analyze-input" role="button" ng-show="ctrl.authUrl">
        Allow SCAPES to access Google Docs.
      </a>
      <div class="analyze-text lead" ng-show="ctrl.statusMessage">
        {{ctrl.statusMessage}}
      </div>
      <a ng-href="{{ctrl.pipelineUrl}}" ng-show="ctrl.pipelineUrl" class="lead">
        See the pipeline in action.
      </a>
    </div>
    <div ng-hide="ctrl.isUserLoggedIn">
      <h1>SCAPES</h1>
      <p class="lead">
        Please sign in.
      </p>
      <a ng-href="{{ctrl.loginUrl}}" class="btn btn-primary btn-lg btn-block"
          role="button">
        Sign in with a Google Account.
      </a>

    </div>
  </div>

</div><!-- /.container -->

